<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>信息反馈</title>

		<!-- basic styles -->

		<link href="assets-ace/css/bootstrap.min.css" rel="stylesheet" />
		<!--<link rel="stylesheet" href="assets-ace/css/font-awesome.min.css" />-->

		<!--[if IE 7]>
		  <!--<link rel="stylesheet" href="assets/css/font-awesome-ie7.min.css" />-->
		<![endif]-->

		<!-- page specific plugin styles -->

		<!--<link rel="stylesheet" href="assets-ace/css/jquery-ui-1.10.3.custom.min.css" />-->
		<!--<link rel="stylesheet" href="assets-ace/css/jquery.gritter.css" />-->
		<!--<link rel="stylesheet" href="assets-ace/css/select2.css" />-->
		<!--<link rel="stylesheet" href="assets-ace/css/bootstrap-editable.css" />-->

		<!-- ace styles -->

		<link rel="stylesheet" href="assets-ace/css/ace.min.css" />
		<!--<link rel="stylesheet" href="assets-ace/css/ace-rtl.min.css" />-->
		<!--<link rel="stylesheet" href="assets-ace/css/ace-skins.min.css" />-->

		<!--[if lte IE 8]>
		  <!--<link rel="stylesheet" href="assets/css/ace-ie.min.css" />-->
		<![endif]-->

		<!-- inline styles related to this page -->

		<!-- ace settings handler -->

		<!--<script src="assets-ace/js/ace-extra.min.js"></script>-->

		<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->

		<!--[if lt IE 9]>
		<!--<script src="assets/js/html5shiv.js"></script>-->
		<!--<script src="assets/js/respond.min.js"></script>-->
		<![endif]-->
		<script type="text/javascript">
            window.jQuery || document.write("<script src='assets-ace/js/jquery-2.0.3.min.js'>"+"<"+"/script>");
		</script>
	</head>

	<body>
		<div class="page-header">
			<h1>信息反馈 </h1>
		</div><!-- /.page-header -->

		<h4 class="header blue">请勾选相应选项：</h4>

		<div class="flow">
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<input type='checkbox' name='VoteOption1' value="系统迟钝">系统迟钝
			&nbsp;&nbsp;&nbsp;
			<input type='checkbox' name='VoteOption1' value="订单错误">订单错误
			&nbsp;&nbsp;&nbsp;
			<input type='checkbox' name='VoteOption1' value="登录迟缓">登录迟缓
			&nbsp;&nbsp;&nbsp;
			<input type='checkbox' name='VoteOption1' value="其他">其他
		</div>
		<br><br>
		<div class="row">
			<div class="col-xs-12">
				<!-- PAGE CONTENT BEGINS -->
				<div class="row">
					<div class="col-sm-12">

						<div class="widget-box">
							<div class="widget-body">
								<div class="widget-main no-padding">
									<div class="wysiwyg-editor" id="editor2"></div>
								</div>
								<div class="widget-toolbox padding-4 clearfix">

									<div class="btn-group pull-right">
										<button class="btn btn-sm btn-danger" id="save">
											<i class="icon-save bigger-125"></i>
											临时保存
										</button>

										<button class="btn btn-sm btn-success" id="publish">
											<i class="icon-globe bigger-125"></i>
											发送
											<i class="icon-arrow-right icon-on-right bigger-125"></i>
										</button>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>

				<script type="text/javascript">
					var $path_assets = "assets";//this will be used in loading jQuery UI if needed!
				</script>

				<!-- PAGE CONTENT ENDS -->
			</div><!-- /.col -->
		</div><!-- /.row -->

		<script src="assets-ace/js/bootstrap.min.js"></script>
		<!--<script src="assets-ace/js/typeahead-bs2.min.js"></script>-->

		<!-- page specific plugin scripts -->

		<!--<script src="assets-ace/js/jquery-ui-1.10.3.custom.min.js"></script>-->
		<!--<script src="assets-ace/js/jquery.ui.touch-punch.min.js"></script>-->
		<!--<script src="assets-ace/js/markdown/markdown.min.js"></script>-->
		<!--<script src="assets-ace/js/markdown/bootstrap-markdown.min.js"></script>-->
		<script src="assets-ace/js/jquery.hotkeys.min.js"></script>
		<script src="assets-ace/js/bootstrap-wysiwyg.min.js"></script>
		<!--<script src="assets-ace/js/bootbox.min.js"></script>-->

		<!-- ace scripts -->

		<script src="assets-ace/js/ace-elements.min.js"></script>
		<!--<script src="assets-ace/js/ace.min.js"></script>-->
		<!-- inline scripts related to this page -->

		<script type="text/javascript">

			jQuery(function($){

                if(sessionStorage.getItem("staff")==null){
                    $("#publish").attr("disabled",true);
                }

                $("#editor2").html(sessionStorage.getItem("feedback")!=null?sessionStorage.getItem("feedback"):"请在这里输入。。。");

			    $("#publish").on("click",function () {
			        var check=document.getElementsByTagName("input");
			        var temp="";
			        for(var i=0;i<check.length;i++){
			            if(check[i].checked){
			                temp+=check[i].value+" ";
						}
					}
                    var userId=JSON.parse(sessionStorage.getItem("staff")).id;
                    var feedback=$("#editor2").html();
                    $.post("http://localhost:8080/addActivities",
                        {
                            "userId":userId,
							"activity":"信息反馈："+temp+""+feedback,
							"type":"信息反馈"
                        },
                        function (data) {
                            if(data==true){
                                alert("发送成功，校园快递感谢您的反馈！");
                            }else{
                                sessionStorage.setItem("feedback",feedback);
                                alert("发送失败，系统已将反馈内容临时保存，请重试！");
                            }
                        }
                    );
                });

			    $("#save").on("click",function () {
                    feedback=$("#editor2").html();
                    sessionStorage.setItem("feedback",feedback);
                    alert("临时保存成功！");
                });

	
//	function showErrorAlert (reason, detail) {
//		var msg='';
//		if (reason==='unsupported-file-type') { msg = "Unsupported format " +detail; }
//		else {
//			console.log("error uploading file", reason, detail);
//		}
//		$('<div class="alert"> <button type="button" class="close" data-dismiss="alert">&times;</button>'+
//		 '<strong>File upload error</strong> '+msg+' </div>').prependTo('#alerts');
//	}

	//$('#editor1').ace_wysiwyg();//this will create the default editor will all buttons

	//but we want to change a few buttons colors for the third style
//	$('#editor1').ace_wysiwyg({
//		toolbar:
//		[
//			'font',
//			null,
//			'fontSize',
//			null,
//			{name:'bold', className:'btn-info'},
//			{name:'italic', className:'btn-info'},
//			{name:'strikethrough', className:'btn-info'},
//			{name:'underline', className:'btn-info'},
//			null,
//			{name:'insertunorderedlist', className:'btn-success'},
//			{name:'insertorderedlist', className:'btn-success'},
//			{name:'outdent', className:'btn-purple'},
//			{name:'indent', className:'btn-purple'},
//			null,
//			{name:'justifyleft', className:'btn-primary'},
//			{name:'justifycenter', className:'btn-primary'},
//			{name:'justifyright', className:'btn-primary'},
//			{name:'justifyfull', className:'btn-inverse'},
//			null,
//			{name:'createLink', className:'btn-pink'},
//			{name:'unlink', className:'btn-pink'},
//			null,
//			{name:'insertImage', className:'btn-success'},
//			null,
//			'foreColor',
//			null,
//			{name:'undo', className:'btn-grey'},
//			{name:'redo', className:'btn-grey'}
//		],
////		'wysiwyg': {
////			fileUploadError: showErrorAlert
////		}
//	}).prev().addClass('wysiwyg-style2');

	

	$('#editor2').css({'height':'200px'}).ace_wysiwyg({
		toolbar_place: function(toolbar) {
			return $(this).closest('.widget-box').find('.widget-header').prepend(toolbar).children(0).addClass('inline');
		},
		toolbar:
		[
			'bold',
			{name:'italic' , title:'Change Title!', icon: 'icon-leaf'},
			'strikethrough',
			null,
			'insertunorderedlist',
			'insertorderedlist',
			null,
			'justifyleft',
			'justifycenter',
			'justifyright'
		],
		speech_button:false
	});

	$('[data-toggle="buttons"] .btn').on('click', function(e){
		var target = $(this).find('input[type=radio]');
		var which = parseInt(target.val());
		var toolbar = $('#editor1').prev().get(0);
		if(which == 1 || which == 2 || which == 3) {
			toolbar.className = toolbar.className.replace(/wysiwyg\-style(1|2)/g , '');
			if(which == 1) $(toolbar).addClass('wysiwyg-style1');
			else if(which == 2) $(toolbar).addClass('wysiwyg-style2');
		}
	});


	

	//Add Image Resize Functionality to Chrome and Safari
	//webkit browsers don't have image resize functionality when content is editable
	//so let's add something using jQuery UI resizable
	//another option would be opening a dialog for user to enter dimensions.
//	if ( typeof jQuery.ui !== 'undefined' && /applewebkit/.test(navigator.userAgent.toLowerCase()) ) {
//
//		var lastResizableImg = null;
//		function destroyResizable() {
//			if(lastResizableImg == null) return;
//			lastResizableImg.resizable( "destroy" );
//			lastResizableImg.removeData('resizable');
//			lastResizableImg = null;
//		}
//
//		var enableImageResize = function() {
//			$('.wysiwyg-editor')
//			.on('mousedown', function(e) {
//				var target = $(e.target);
//				if( e.target instanceof HTMLImageElement ) {
//					if( !target.data('resizable') ) {
//						target.resizable({
//							aspectRatio: e.target.width / e.target.height,
//						});
//						target.data('resizable', true);
//
//						if( lastResizableImg != null ) {//disable previous resizable image
//							lastResizableImg.resizable( "destroy" );
//							lastResizableImg.removeData('resizable');
//						}
//						lastResizableImg = target;
//					}
//				}
//			})
//			.on('click', function(e) {
//				if( lastResizableImg != null && !(e.target instanceof HTMLImageElement) ) {
//					destroyResizable();
//				}
//			})
//			.on('keydown', function() {
//				destroyResizable();
//			});
//	    }
//
//		enableImageResize();

		/**
		//or we can load the jQuery UI dynamically only if needed
		if (typeof jQuery.ui !== 'undefined') enableImageResize();
		else {//load jQuery UI if not loaded
			$.getScript($path_assets+"/js/jquery-ui-1.10.3.custom.min.js", function(data, textStatus, jqxhr) {
				if('ontouchend' in document) {//also load touch-punch for touch devices
					$.getScript($path_assets+"/js/jquery.ui.touch-punch.min.js", function(data, textStatus, jqxhr) {
						enableImageResize();
					});
				} else	enableImageResize();
			});
		}
		*/
//	}


});
		</script>

	</body>
</html>
